<template>
  <section class="component work-user">
    <el-dropdown @command="dropdownClickHandle" trigger="click">
      <div class="row middle-span">
        <img class="user-photo" src="@/assets/images/common/user-photo.png" />
        <span class="user-name">欢迎您, {{userData.realName}}</span>
        <i class="el-icon-arrow-down el-icon--right"></i>
      </div>
      <el-dropdown-menu slot="dropdown" style="width:140px">
        <el-dropdown-item command="password">修改密码</el-dropdown-item>
        <el-dropdown-item v-if="isAdmin&&userData.systemStatus==='DISABLED'" command="ENABLED" >系统一键暂停</el-dropdown-item>
        <el-dropdown-item v-if="isAdmin&&userData.systemStatus==='ENABLED'" command="DISABLED">系统一键启用</el-dropdown-item>
        <el-dropdown-item command='exit'>退出</el-dropdown-item>
      </el-dropdown-menu>
    </el-dropdown>
    <el-dialog :visible.sync="dialog.workPassword" width="500px" title="修改密码" :close-on-click-modal="false" :close-on-press-escape="false" :show-close="false">
      <work-password ref="work-password" @close="dialog.workPassword=false"></work-password>
    </el-dialog>
  </section>
</template>

<script lang="ts">
import Vue from 'vue';
import Component from 'vue-class-component';
import { Dependencies } from '~/core/decorator';
import { State, Mutation,Getter } from 'vuex-class';
import WorkPassword from '~/components/workspace/work-password.vue';
import { SystemParamService } from '~/services/management-service/system-param.service';
import { LoginService } from '~/services/management-service/login.service';
import store from '~/store';
import { removeUID } from "~/core/bootstrap/auth.init";

@Component({
  components: {
    WorkPassword,
  },
})
export default class WorkUser extends Vue {
  @Dependencies(SystemParamService)
  private sysParamService: SystemParamService;
  @Dependencies(LoginService)
  private loginService: LoginService;
  @State
  private userData;
  private userToken: string;
  @Getter
  private isAdmin: boolean;

  private dialog = {
    workPassword: false,
  };
/**
 * 系统一键暂停
 */
  private suspend(){
    const suspendData:any={
      systemStatus:'ENABLED'
    }
    this.sysParamService.switchSystemStatus(suspendData).subscribe(
        (data) => {
          this.$message.success('操作成功');
          removeUID({store})
          this.$router.push('/');
        }
      );
    
  }
  /**
   * 系统一键启用
   */
  private Enable(){
  const suspendData:any={
      systemStatus:'DISABLED'
    }
    this.sysParamService.switchSystemStatus(suspendData).subscribe(
        (data) => {
          this.$message.success('操作成功');
          removeUID({store})
          this.$router.push('/');
        }
      );
  }
  /**
   * 退出
   */
  private Exit(){
  this.loginService.logout().subscribe(
      (data) => {
        removeUID({store})
        this.$router.push('/');
      }
    );
  }

  /**
   *  用户操作处理
   */
  private dropdownClickHandle(command) {
    switch (command) {
      case 'exit':
        this.Exit()
        break;
      case 'password':
        this.dialog.workPassword = true;
        break;
      case 'ENABLED':
        this.suspend()
        break;
      case 'DISABLED':
        this.Enable()
        break;
    }
  }
}
</script>

<style lang="less" scoped>
.work-user.component {
  * {
    padding: 0 10px;
    color: white;
  }
}
</style>
